<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>餐饮美食-胡凌峰</title>
    <link rel="stylesheet" href="./css/base.css">
    <link rel="stylesheet" href="./css/index.css">
</head>

<body>
    <main>
        <!-- 焦点 -->
        <ul class="doc">
            <li>
                <span class="item item-on"></span>
                <div>网站首页</div>
            </li>
            <li>
                <span class="item"></span>
                <div>关于我们</div>
            </li>
            <li>
                <span class="item"></span>
                <div>优质服务</div>
            </li>
            <li>
                <span class="item"></span>
                <div>菜品系列</div>
            </li>
            <li>
                <span class="item"></span>
                <div>新闻中心</div>
            </li>
            <li>
                <span class="item"></span>
                <div>联系我们</div>
            </li>
        </ul>
        <div class="wrap">
            <!-- 首页 -->
            <section>
                <div class="main">
                    <!-- logo -->
                    <div class="logo">
                        <img src="./images/logo.png" alt="">
                    </div>
                    <!-- 导航 -->
                    <nav>
                        <a href="#" class="on">网站首页</a>
                        <a href="#">关于我们</a>
                        <a href="#">菜品系列</a>
                        <a href="#">新闻中心</a>
                        <a href="#">合作加盟</a>
                        <a href="#">联系我们</a>
                    </nav>
                    <!-- 舌尖上的美味 -->
                    <div class="tasty">
                        舌尖上的美味
                    </div>
                    <!-- 具体介绍 -->
                    <div class="introduce">
                        <p>
                            中餐的菜肴以色艳、香浓、味鲜、型美而著称于世其型美，尤以花式冷拼盘较为突出
                        </p>
                        <p>
                            它造型别致、五彩缤、栩栩如生，呈现出富有意境的景色和图案
                        </p>
                    </div>
                    <!-- 查看详细&联系我们 -->
                    <a href="#" class="details">
                        查看详细
                    </a>
                    <a href="#" class="details">
                        联系我们
                    </a>
                </div>
            </section>
            <!-- 关于我们 -->
            <section>
                <div class="main">
                    <!-- 标题 -->
                    <div class="title">
                        关于我们
                    </div>
                    <!-- 英文 -->
                    <div class="english">
                        ABOUT US
                    </div>
                    <!-- 有限公司 -->
                    <div class="company">
                        Delicious food餐饮有限公司
                    </div>
                    <!-- 公司简介 -->
                    <div class="company-idc">
                        <p>
                            餐饮有限公司创建于1997年，公司总部位于全国卫生城市--XXX市。（位于中国“黄金水道”——长江下游南岸江苏省境内， 处于中国沿江及沿海两大经济带的交汇处，上海、南京、苏州、无锡等大中城市环列四周，距上海98公里、苏州58公里、无锡40公里、常州70公里、南通30公里、南京200公里，距虹桥机场98公里，浦东机场150公里，南京禄口机场200公里。）
                        </p>
                        <p>
                            我们是一家家式大众餐厅，以XXXXX系列特色菜及盱眙龙虾为主流，兼营冷菜、热菜、酒饮茶等食品，是家庭休闲，商务简餐，朋友小聚，情侣约会，生日聚会的理想处所。餐厅装饰简约时尚，苏州园林文化浓郁。
                        </p>
                        <p>
                            我们独有的神秘配方和标准化产品操作流程为产品完全口味统一奠定坚实的基础，将复杂的制作傻瓜化，外地加盟店只要在当地找一批工资底有基础的厨师经总部派遣的技术总监稍做指导，便能做出符合要求的菜肴。我们餐饮有限公司很重视产品的研发和创新，餐单有规律翻新，坚持不断促销活动，使老顾客不断增加，以致生意常年稳定。统一风格的装修，完善的培训体系及强大的策划能力给投资者更大的回报目前分店每到一处均生意火爆异常。将复杂的制作傻瓜化，外地加盟店只要在当地找一批工资底有基础的厨师经总部派遣的技术总监稍做指导，便能做出符合要求的菜肴。我们餐饮有限公司很重视产品的研发和创新，餐单有规律翻新，坚持不断促销活动，使老顾客不断增加，以致生意常年稳定。统一风格的装修，完善的培训体系及强大的策划能力给投资者更大的回报目前分店每到一处均生意火爆异常。我们是一家家式大众餐厅，以XXXXX系列特色菜及盱眙龙虾为主流，兼营冷菜、热菜、酒饮茶等食品，是家庭休闲，商务简餐，朋友小聚，情侣约会，生日聚会的理想处所。餐厅装饰简约时尚，苏州园林文化浓郁。
                        </p>
                        <p>
                            我们是一家家式大众餐厅，以XXXXX系列特色菜及盱眙龙虾为主流，兼营冷菜、热菜、酒饮茶等食品，是家庭休闲，商务简餐，朋友小聚，情侣约会，生日聚会的理想处所。餐厅装饰简约时尚，苏州园林文化浓郁。
                        </p>
                        <!-- 滚轮 -->
                        <div class="wheel">
                            <a href="#" class="wheel-back"></a>
                            <div class="wheel-tiao">
                                <div class="bgtiao">
                                    <div class="dong">
                                    </div>
                                </div>
                            </div>
                            <a href="#" class="wheel-forward"></a>
                        </div>
                    </div>
                    <!-- 公司图片 -->
                    <div class="company-img">
                        <img src="./images/pic01.png" alt="">
                    </div>
                </div>
            </section>
            <!-- 优质服务 -->
            <section>
                <div class="main">
                    <!-- 标题 -->
                    <div class="title">
                        优质服务
                    </div>
                    <!-- 英文 -->
                    <div class="english">
                        PERFECT SERVICES
                    </div>
                    <!-- 内容 -->
                    <div class="search one">
                        <img src="./images/icon01.png" alt="" class="search-img">
                        <div class="search-title">
                            **的菜品菜式
                        </div>
                        <div class="search-txt">
                            <p>
                                独有的神秘配方和标准化产品操作流程为
                            </p>
                            <p>
                                产品完全口味统一奠定坚实的基础，
                            </p>
                            <p>
                                将复杂的制作傻瓜化
                            </p>
                        </div>
                    </div>
                    <div class="search two">
                        <img src="./images/icon02.png" alt="" class="search-img">
                        <div class="search-title">
                            专业的厨师团队
                        </div>
                        <div class="search-txt">
                            <p>
                                学习厨师需要一定的文化知识和一定承受能力以
                            </p>
                            <p>
                                及判断能力学习厨师烹饪可
                            </p>
                            <p>
                                报考相关的烹饪学校或者跟师傅
                            </p>
                        </div>
                    </div>
                    <div class="search three">
                        <img src="./images/icon03.png" alt="" class="search-img">
                        <div class="search-title">
                            严谨的管理体系
                        </div>
                        <div class="search-txt">
                            <p>
                                统一风格的装修，完善的培训体系及强大的
                            </p>
                            <p>
                                策划能力给投资者更大的回报，目前
                            </p>
                            <p>
                                分店每到一处均生意火爆异常
                            </p>
                        </div>
                    </div>
                </div>
            </section>
            <!-- 菜品系列 -->
            <section>
                <div class="main">
                    <!-- 标题 -->
                    <div class="title">
                        菜品系列
                    </div>
                    <!-- 英文 -->
                    <div class="english">
                        SERIES OF DISHES
                    </div>
                    <!-- 系列 -->
                    <div class="finds">
                        <a href="#" class="active">【川菜】</a>
                        <a href="#">【粤菜】</a>
                        <a href="#">【湘菜】</a>
                        <a href="#">【鲁菜】</a>
                        <a href="#">【闽菜】</a>
                        <a href="#">【鄂菜】</a>
                    </div>
                    <!-- 菜品展示图 -->
                    <div class="caitu">
                        <a href="#">
                            <img src="./images/cai1.jpg" alt="">
                            <span>蚂蚁上树</span>
                        </a>
                        <a href="#">
                            <img src="./images/cai2.jpg" alt="">
                            <span>金玉满堂</span>
                        </a>
                        <a href="#">
                            <img src="./images/cai3.jpg" alt="">
                            <span>酱香芋夹</span>
                        </a>
                        <a href="#">
                            <img src="./images/cai4.jpg" alt="">
                            <span>糯米排骨</span>
                        </a>
                        <a href="#">
                            <img src="./images/cai5.jpg" alt="">
                            <span>龙眼甜烧白</span>
                        </a>
                        <a href="#">
                            <img src="./images/cai6.jpg" alt="">
                            <span>红烧茄子</span>
                        </a>
                        <a href="#">
                            <img src="./images/cai7.jpg" alt="">
                            <span>陈皮排骨</span>
                        </a>
                        <a href="#">
                            <img src="./images/cai8.jpg" alt="">
                            <span>板栗红烧肉</span>
                        </a>
                    </div>
                    <!-- 查看更多 -->
                    <a href="#" class="more">
                        查看更多
                    </a>
                </div>
            </section>
            <!-- 新闻中心 -->
            <section>
                <div class="main">
                    <!-- 标题 -->
                    <div class="title">
                        新闻中心
                    </div>
                    <!-- 英文 -->
                    <div class="english">
                        NEWS CENTER
                    </div>
                    <!-- 新闻图片 -->
                    <div class="news-img">
                        <img src="./images/news.jpg" alt="">
                        <div class="news-tips">
                            <div class="tips-top">
                                <a href="#">早晚生食板栗有助补肾</a>
                            </div>
                            <div class="tips-mid">
                                2014-10-15
                            </div>
                            <div class="tips-btm">
                                民间用板栗补养、治病的方法很多，但多数人都是熟吃，殊不知，生食板栗补肾的效果大大超过了熟食。
                            </div>
                        </div>
                    </div>
                    <!-- 新闻内容 -->
                    <div class="news">
                        <div class="news-con">
                            <div class="news-title">
                                <a href="#">日本较大抹茶餐饮七叶和茶登陆上海</a>
                            </div>
                            <div class="news-time">
                                2014-10-15
                            </div>
                            <div class="news-txt">
                                日本较大的抹茶餐饮连锁正式登陆上海，其中国**店以打造健康潮流的抹茶专营店为理念，选择在沪上人气之地美罗城地下一层。开幕发布会现场，多款风行于日本的特色美食精彩亮相。
                            </div>
                        </div>
                        <div class="news-con">
                            <div class="news-title">
                                <a href="#">北京年内推出早餐“规范店”和“示范店”</a>
                            </div>
                            <div class="news-time">
                                2014-10-15
                            </div>
                            <div class="news-txt">
                                北京市商务委相关负责人在日前召开的本市“早餐工作经验交流会”上表示，2010年，本市早餐示范工作的总体目标是：发掘一批早餐品牌连锁企业和 早餐食品配送供应商，在全市建成一批“早餐连锁企业示范店”，各区县还要树立一批早餐示范企业，规划建设或改造符合食品卫生要求的早餐经营网点。
                            </div>
                        </div>
                        <div class="news-con">
                            <div class="news-title">
                                <a href="#">成都餐饮企业进中国餐饮百强 可获奖5万</a>
                            </div>
                            <div class="news-time">
                                2014-10-15
                            </div>
                            <div class="news-txt">
                                成都餐饮企业进2009年度中国餐饮百强榜可获奖5万元。3日，成都市商务局和市财政局联合下发了《成都市2010年度支持重点商贸流通企业做大做强项目资金实施细则》，其中提出，今年，成都市将采用资金奖励、补贴和贴息等方式重点支持重点商贸流通企业和品牌餐饮企业及大型生猪屠宰产业化龙头企业。
                            </div>
                        </div>
                    </div>
                    <!-- 查看更多 -->
                    <a href="#" class="more">
                        查看更多
                    </a>
                </div>
            </section>
            <!-- 联系我们 -->
            <section>
                <div class="main">
                    <!-- 标题 -->
                    <div class="title">
                        联系我们
                    </div>
                    <!-- 英文 -->
                    <div class="english">
                        CONTACT US
                    </div>
                    <!-- 地图 -->
                    <div class="map">
                        <div style="width:100%;height:100%;border:#ccc solid 1px;font-size:12px" id="map"></div>
                    </div>
                    <!-- 热线 -->
                    <div class="phone">
                        <div class="phone-con">
                            <!-- 小图标 -->
                            <img src="./images/lianxi.png" alt="" class="tubiao">
                            <!-- 联系方式 -->
                            <div class="phone-way">
                                <p>
                                    商务热线：400-000-00
                                </p>
                                <p>
                                    电 话：010-400-000-0000
                                </p>
                                <p>
                                    邮 箱：
                                    <a href="#">123456@126.com</a>
                                </p>
                                <p>
                                    客 服 Q Q：12345678
                                </p>
                                <p>
                                    地址：广州市海珠区某某路沙溪西畔里某某街XX号
                                </p>
                            </div>
                            <!-- 二维码 -->
                            <img src="./images/qr.png" alt="" class="qrcode">
                        </div>
                    </div>
                </div>
            </section>
        </div>
    </main>
    <script src="./js/index.js"></script>
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=I7TTxtjy34ZMaWwL1VNncMvUqOv8IksN"></script>
    <script type="text/javascript">
        //创建和初始化地图函数：
        function initMap() {
            createMap(); //创建地图
            setMapEvent(); //设置地图事件
            addMapControl(); //向地图添加控件
            addMapOverlay(); //向地图添加覆盖物
        }

        function createMap() {
            map = new BMap.Map("map");
            map.centerAndZoom(new BMap.Point(113.943365, 35.289409), 15);
        }

        function setMapEvent() {
            map.enableScrollWheelZoom();
            map.enableKeyboard();
            map.enableDragging();
            map.enableDoubleClickZoom()
        }

        function addClickHandler(target, window) {
            target.addEventListener("click", function() {
                target.openInfoWindow(window);
            });
        }

        function addMapOverlay() {
            var markers = [];
            for (var index = 0; index < markers.length; index++) {
                var point = new BMap.Point(markers[index].position.lng, markers[index].position.lat);
                var marker = new BMap.Marker(point, {
                    icon: new BMap.Icon("http://api.map.baidu.com/lbsapi/createmap/images/icon.png", new BMap.Size(20, 25), {
                        imageOffset: new BMap.Size(markers[index].imageOffset.width, markers[index].imageOffset.height)
                    })
                });
                var label = new BMap.Label(markers[index].title, {
                    offset: new BMap.Size(25, 5)
                });
                var opts = {
                    width: 200,
                    title: markers[index].title,
                    enableMessage: false
                };
                var infoWindow = new BMap.InfoWindow(markers[index].content, opts);
                marker.setLabel(label);
                addClickHandler(marker, infoWindow);
                map.addOverlay(marker);
            };
        }
        //向地图添加控件
        function addMapControl() {
            var scaleControl = new BMap.ScaleControl({
                anchor: BMAP_ANCHOR_BOTTOM_LEFT
            });
            scaleControl.setUnit(BMAP_UNIT_IMPERIAL);
            map.addControl(scaleControl);
            var navControl = new BMap.NavigationControl({
                anchor: BMAP_ANCHOR_TOP_LEFT,
                type: BMAP_NAVIGATION_CONTROL_LARGE
            });
            map.addControl(navControl);
            var overviewControl = new BMap.OverviewMapControl({
                anchor: BMAP_ANCHOR_BOTTOM_RIGHT,
                isOpen: true
            });
            map.addControl(overviewControl);
        }
        var map;
        initMap();
    </script>
</body>

</html>